import React, { PureComponent } from "react";
import { connect } from "dva";
import { Link, Route, routerRedux } from "dva/router";
import {
  Row,
  Col,
  Card,
  Form,
  Button,
  Icon,
  Menu,
  Dropdown,
  notification,
  Select,
  Input
} from "antd";
import styles from "./Index.less";
import CodeDemoForm from "../../components/CodeDemoForm";
import globalUtil from "../../utils/global";

const { Option } = Select;
const formItemLayout = {
  labelCol: {
    span: 5
  },
  wrapperCol: {
    span: 19
  }
};

@connect(({ user, global }) => ({
  currUser: user.currentUser,
  groups: global.groups
}))
@Form.create()
export default class Index extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      codeType: "Git",
      showUsernameAndPass: false,
      showKey: false,
      addGroup: false
    };
  }
  onAddGroup = () => {
    this.setState({ addGroup: true });
  };
  cancelAddGroup = () => {
    this.setState({ addGroup: false });
  };
  handleAddGroup = vals => {
    const { setFieldsValue } = this.props.form;
    this.props.dispatch({
      type: "groupControl/addGroup",
      payload: {
        team_name: globalUtil.getCurrTeamName(),
        ...vals
      },
      callback: group => {
        setFieldsValue({ group: 111 });
      }
    });
  };
  fetchGroup = () => {
    this.props.dispatch({
      type: "global/fetchGroups",
      payload: {
        team_name: globalUtil.getCurrTeamName()
      }
    });
  };
  handleSubmit = value => {
    const teamName = globalUtil.getCurrTeamName();
    this.props.dispatch({
      type: "createApp/createAppByCode",
      payload: {
        team_name: teamName,
        code_from: "gitlab_demo",
        ...value
      },
      callback: data => {
        const appAlias = data && data.bean.service_alias;
        this.props.dispatch(
          routerRedux.push(
            `/team/${globalUtil.getCurrTeamName()}/region/${globalUtil.getCurrRegionName()}/create/create-check/${appAlias}`
          )
        );
      }
    });
  };
  render() {
    const { getFieldDecorator, getFieldValue } = this.props.form;
    const { groups } = this.props;
    const code = decodeURIComponent(this.props.match.params.code || "");
    return (
      <Card>
        <div className={styles.formWrap}>
          <CodeDemoForm
            data={{ git_url: code || "" }}
            onSubmit={this.handleSubmit}
          />
        </div>
      </Card>
    );
  }
}
